<template>
  <div>
    <a-input-search @search="chooseUser" read-only v-model="selectedDepUsers" placeholder="请选择用户">
      <a-button slot="enterButton" :disabled="disabled">选择用户</a-button>
    </a-input-search>
    <j-select-certificate-person-modal ref="selectModal" :modal-width="modalWidth" @submit="submit" />
  </div>
</template>
<script>
import JSelectCertificatePersonModal from './modal/JSelectCertificatePersonModal'

export default {
  name: 'JSelectCertificatePerson',
  components: { JSelectCertificatePersonModal },
  props: {
    modalWidth: {
      type: Number,
      default: 1250,
      required: false,
    },
    disabled: {
      type: Boolean,
      required: false,
      default: false,
    },
  },
  data() {
    return {
      placeholder: '请选择人员',
      selectedDepUsers: '',
    }
  },
  methods: {
    chooseUser() {
      this.$refs.selectModal.open()
    },
    submit(record) {
      console.log(record)
      this.selectedDepUsers = record[0].realname
      this.$emit('userMsg', record[0])
    },
  },
}
</script>
<style scoped>
.showData {
  position: absolute;
  width: 80%;
  top: 6px;
  left: 10px;
  height: 28px;
  line-height: 28px;
  border-radius: 5px;
  background: #fff;
  color: rgba(0, 0, 0, 0.35);
}
</style>